<template>
  <el-dialog :append-to-body="true" :close-on-click-modal="false" :visible.sync="dialog" :title="title" fullscreen>
    <component ref="apvComp" :is="currentComp" :sup_this="sup_this" @afterMounted="afterMounted"/>
  </el-dialog>
</template>
<script>
import Vue from 'vue'
export default {
  name: 'DynamicLoadApvComp',
  components: { },
  props: {
    sup_this: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      dialog: false,
      currentComp: null,
      title: '',
      businessKey: ''
    }
  },
  mounted() {
  },
  beforeDestroy() {
    this.currentComp = null
  },
  methods: {
    loadComp: function(componentName, componentUrl, businessKey, title) {
      const myComponent = resolve => require.ensure([], () => resolve(require('@/views' + componentUrl)))
      Vue.component(componentName, myComponent)
      this.businessKey = businessKey
      this.currentComp = componentName
      this.title = title
      this.dialog = true
    },
    afterMounted: function() {
      setTimeout(() => {
        this.$refs.apvComp.viewApproveData(this.businessKey)
      }, 300)
    }
  }
}
</script>
